<template>
  <div>
    <el-table
      :data="moduleTable"
      :span-method="objectSpanMethod"
      border
      style="width: 100%; margin-top: 20px">
      <el-table-column
        prop="auditModule"
        label="模块"
        width="180">
      </el-table-column>
      <el-table-column
        prop="auditType"
        label="类型">
      </el-table-column>
      <el-table-column
        prop="approverName"
        label="权限人">
      </el-table-column>
      <el-table-column
        prop="operation"
        label="操作">
        <template slot-scope="scope">
          <el-button
            @click.native.prevent="onBtn(scope.row)"
            type="text"
            size="small">
            设定
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog title="员工信息" height="300" center :visible.sync="dialogVisible"
               append-to-body :close-on-click-modal="false" style="overflow-y: scroll">
      <!-- 检索结果 -->
      <div>
        <custom-table
          :data="userList"
          :columns="columns"
          :tableLoadingFlag="tableLoadingFlag"
          :operationColumn="operationColumn"
          :pagination="pagination">
        </custom-table>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {apiGetMainDepartmentList, apiUpdateAuditManager, apiGetAllAuditList} from '@/api/config/audit'
  import CustomTable from '@/components/table/CustomTable'
  export default {
    components: {
      CustomTable
    },
    created() {
      this.getAllAuditInfo()
    },
    data() {
      return {
        moduleDto: {
          id: '',
          auditModule: '',
          auditType: '',
          approverName: '',
          approverId: ''
        },
        moduleTable: [],
        dialogVisible: false,
        userColumns: [],
        moduleFormVisible: false,
        moduleFormRule: [],
        columns: [
          {label: 'id', name: 'id', width: '80', align: 'center'},
          {label: '账号', name: 'userName', width: '200', align: 'center'},
          {label: '名字', name: 'name', width: '100', align: 'center'},
          {label: '联系电话', name: 'tel', width: '120', align: 'center'},
          {label: '联系地址', name: 'address', align: 'center'}
        ],
        operationColumn: {
          width: '80',
          operations: [
            {name: '设定', callback: this.checkIt}
          ]
        },
        userList: [],
        tableLoadingFlag: false,
        pagination: this.getData(this.getMainDepartmentList),
        auditSpanList: []
      }
    },
    methods: {
      objectSpanMethod({ row, column, rowIndex, columnIndex }) {
        if (columnIndex === 0) {
          if (rowIndex === 0) {
            return {
              // 备机模块
              rowspan: this.auditSpanList[0].spare,
              colspan: 1
            }
          } else if (rowIndex === this.auditSpanList[0].spare) {
            return {
              rowspan: this.auditSpanList[1].allot,
              colspan: 1
            }
          } else if (rowIndex === this.auditSpanList[0].spare + this.auditSpanList[1].allot) {
            return {
              rowspan: this.auditSpanList[2].scrap,
              colspan: 1
            }
          } else if (rowIndex === this.auditSpanList[0].spare + this.auditSpanList[1].allot + this.auditSpanList[2].scrap){
            return {
              rowspan: this.auditSpanList[3].specialOutStock,
              colspan: 1
            }
          } else {
            return {
              rowspan: 0,
              colspan: 0
            }
          }
        }
      },
      onBtn(row) {
        this.dialogVisible = true
        this.tableLoadingFlag = false
        this.moduleDto.auditModule = row.auditModule
        this.moduleDto.auditType = row.auditType
        this.moduleDto.id = row.id
        this.getMainDepartmentList()
      },
      getMainDepartmentList() {
        let listQuery = {
          roleType: 0,
          pageNumber: this.pagination.currentPage,
          pageSize: this.pagination.pageSize
        }
        apiGetMainDepartmentList(listQuery).then(response => {
          this.userList = response.data
          this.pagination.totalRecords = response.totalRecords
        })
      },
      checkIt (row) {
        var newName = row.name
        this.moduleDto.approverName = newName
        this.moduleDto.approverId = row.id
        if (this.moduleDto.moduleName === '备机模块') {
          this.moduleDto.auditModule = 1
        } else if (this.moduleDto.moduleName === '调拨模块') {
          this.moduleDto.auditModule = 2
        } else if (this.moduleDto.moduleName === '报废模块') {
          this.moduleDto.auditModule = 3
        } else {
          this.moduleDto.auditModule = 4
        }
        if (this.moduleDto.moduleType === '审核') {
          this.moduleDto.auditType = 1
        } else if (this.moduleDto.moduleType === '审批') {
          this.moduleDto.auditType = 2
        } else {
          this.moduleDto.auditType = 3
        }
        apiUpdateAuditManager(this.moduleDto).then(() => {
          this.dialogVisible = false
          this.getAllAuditInfo()
        })
      },
      getAllAuditInfo() {
        apiGetAllAuditList().then(rsp => {
          this.moduleTable = rsp.data
          let dataStorage = this.moduleTable
          let spare = 0
          let allot = 0
          let scrap = 0
          let specialOutStock = 0
          for (let i in dataStorage) {
            if (dataStorage[i].auditModule === 1) {
              spare += 1
            } else if (dataStorage[i].auditModule === 2) {
              allot += 1
            } else if (dataStorage[i].auditModule === 3) {
              scrap += 1
            } else {
              specialOutStock += 1
            }
          }
          this.auditSpanList = [
            {spare: spare},
            {allot: allot},
            {scrap: scrap},
            {specialOutStock: specialOutStock}
          ]
          for (let i in this.moduleTable) {
            if (this.moduleTable[i].auditModule === 1) {
              this.moduleTable[i].auditModule = '备机模块'
            } else if (this.moduleTable[i].auditModule === 2) {
              this.moduleTable[i].auditModule = '调拨模块'
            } else if (this.moduleTable[i].auditModule === 3) {
              this.moduleTable[i].auditModule = '报废模块'
            } else {
              this.moduleTable[i].auditModule = '特殊操作申请模块'
            }
            if (this.moduleTable[i].auditType === 1) {
              this.moduleTable[i].auditType = '审核'
            } else if (this.moduleTable[i].auditType === 2) {
              this.moduleTable[i].auditType = '审批'
            } else {
              this.moduleTable[i].auditType = '发放'
            }
          }
        })
      }
    }
  }
</script>
